<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
    <%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
    <%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>员工列表的新增页面</title>

    <script type="text/javascript" src="/bsc/static/js/jquery.min.js"></script>
    <script type="text/javascript" src="/bsc/static/common/bootstrap/js/bootstrap/js/bootstrap.min.js"></script>
	<link rel="stylesheet" type="text/css" href="/bsc/static/common/bootstrap/js/bootstrap/css/bootstrap.min.css" >
	<script type="text/javascript" src="/bsc/static/common/bootstrapvaildator/js/bootstrapValidator.min.js"></script>
	<script type="text/javascript" src="/bsc/static/common/bootstrapvaildator/js/language/zh_CN.js"></script>

</head>
<body style="margin: 30px;">
<div class="container">
   <center>
<form method="post" action=""  name="form" enctype="multipart/form-data" id="form">
<table border="1" width="80%" rules="all" align="center"  class="table table-bordered">

<tr>
<td  align="center">
	<div class="form-group">
    <label for="shop_user_id">用户编号:</label>
    </div>
</td>
<td colspan="3" >
<div class="form-group" >
<input type="text" name="shop_user_id" value="${id}" class="form-control">
</div>
</td>
</tr>

<tr>
<td align="center" style="padding-top: 10px">
	<div class="form-group">
    <label for="account">员工账号:</label>
    </div>
</td>
<td><div class="form-group"><input type="text" name="account" class="form-control"></div></td>
<td align="center">
   <div class="form-group">
    <label for="photo">头像:</label>
    </div>
</td> 
<td><div class="form-group"><input type="file" name="file" class="form-control"></div></td>
</tr>

<tr>
<td align="center">
   <div class="form-group">
    <label for="username">姓名:</label>
    </div>
</td> 
<td><div class="form-group"><input type="text" name="username" class="form-control"></div></td>
<td align="center">
    <div class="form-group">
    <label for="work_number">工号:</label>
    </div> 
</td> 
<td><div class="form-group"><input type="text" name="work_number" class="form-control"></div></td>
</tr>

<tr>
<td align="center">
    <div class="form-group">
    <label for="password">密码:</label>
    </div>
</td> 
<td><div class="form-group"><input type="password" name="password" class="form-control"></div></td>
<td align="center">
    <div class="form-group">
    <label for="pwd">确认密码:</label>
    </div>
</td> 
<td><div class="form-group"><input type="password" name="pwd" class="form-control"></div></td>
</tr>

<tr>
<td align="center">
    <div class="form-group">
    <label for="sex">性别:</label>
    </div>
</td> 
<td><div class="form-group"><select name="sex" class="form-control">
<option value="0">保密</option>
<option value="1">男</option>
<option value="2">女</option>
</select></div></td>
<td align="center">
    <div class="form-group">
    <label for="status">用户状态:</label>
    </div>
</td> 
<td><div class="form-group"><select name="status" class="form-control">
<option value="0">离职</option>
<option value="1">在职</option>
</select></div></td>
</tr>

<tr>
<td align="center">
    <div class="form-group">
    <label for="bis_Shopshop_id.shop_id">店铺名称:</label>
    </div>
</td> 
<td><div class="form-group"><select name="bis_Shopshop_id.shop_id" class="form-control">
<c:forEach items="${listbis_shop }" var="bis_shop">
<option value="${bis_shop.shop_id }">${bis_shop.shop_name }</option>
</c:forEach>
</select></div></td>
<td align="center">
    <div class="form-group">
    <label for="bis_shop_postpost_code.post_code">职位:</label>
    </div>
</td> 
<td><div class="form-group"><select name="bis_shop_postpost_code.post_code" class="form-control" >
<c:forEach items="${listbis_shop_post }" var="bis_shop_post">
<option value="${bis_shop_post.post_code }">${bis_shop_post.post_name}</option>
</c:forEach>
</select></div></td>
</tr>

<tr>
<td align="center">
    <div class="form-group">
    <label for="mobile">手机:</label>
    </div>
</td> 
<td><div class="form-group"><input type="text" name="mobile" class="form-control"></div></td>
<td  align="center">
    <div class="form-group">
    <label for="idno">身份证:</label>
    </div>
</td> 
<td><div class="form-group"><input type="text" name="idno" class="form-control"></div></td>
</tr>

<tr>
<td align="center">
    <div class="form-group">
    <label for="电话:">电话:</label>
    </div>
</td> 
<td><div class="form-group"><input type="text" name="phone" class="form-control"></div></td>
<td align="center">
    <div class="form-group">
    <label for="email">邮箱:</label>
    </div>
</td> 
<td><div class="form-group"><input type="text" name="email" class="form-control"></div></td>
</tr>

<tr>
<td align="center">
    <div class="form-group">
    <label for="born_date">出生日期:</label>
    </div>
</td> 
<td><div class="form-group"><input type="date" name="born_date" class="form-control"></div></td>
<td align="center">
    <div class="form-group">
    <label for="entry_date">入职日期:</label>
    </div>
</td> 
<td><div class="form-group"><input type="date" name="entry_date"  class="form-control"></div></td>
</tr>

<tr>
<td align="center">
    <div class="form-group">
    <label for="linkman">紧急联系人:</label>
    </div>
</td> 
<td><div class="form-group"><input type="text" name="linkman" class="form-control"></div></td>
<td align="center">
    <div class="form-group">
    <label for="linkphone">紧急联系电话:</label>
    </div>
</td> 
<td><div class="form-group"><input type="text" name="linkphone" class="form-control"></div></td>
</tr>

<tr>
<td align="center">
    <div class="form-group">
    <label for="address">居住地址:</label>
    </div>
</td> 
<td colspan="3"><div class="form-group"><input type="text" name="address" class="form-control"></div></td>
</tr>

<tr>
<td align="center">
    <div class="form-group">
    <label for="remark">备注:</label>
    </div>
</td> 
<td colspan="3"><div class="form-group"><input type="text" name="remark"  class="form-control"></div></td>
</tr>

</table>
<div align="right" style=" padding-right:115px ; padding-top:10px ;" class="modal-footer">
<input type="button" style="width: 80px ;height: 30px " value="保  存" id="zjjpreserve">
</div>
</form>
</center>
   </div>
</body>

<script type="text/javascript">
//开始表单验证
var form = $('#form');
$(document).ready(function() {
	form.bootstrapValidator({
		message: '输入值不合法',
		feedbackIcons: {
			valid: 'glyphicon glyphicon-ok',
			invalid: 'glyphicon glyphicon-remove',
			validating: 'glyphicon glyphicon-refresh'
		},
		fields: {
			account: {
				message: '员工账号不合法',
				validators: {
					notEmpty: {
						message: '员工账号不能为空'
					},
					stringLength: {
						min: 2,
						max: 16,
						message: '请输入2到16个字符'
					},
					regexp: {
						regexp: /^[0-9a-zA-Z_]{1,}$/,
						message: '员工账号只能由字母、数字、下划线组成'
					}
				}
			},
			username: {
				message: '姓名不合法',
				validators: {
					notEmpty: {
						message: '姓名不能为空'
					},
					stringLength: {
						min: 2,
						max: 30,
						message: '请输入2到30个字符'
					},
					regexp: {
						regexp: /^[a-zA-Z0-9_\. \u4e00-\u9fa5 ]+$/,
						message: '姓名只能由字母、数字、点、下划线和汉字组成 '
					}
				}
			},
			work_number: {
				message: '工号不合法',
				validators: {
					notEmpty: {
						message: '工号不能为空'
					},
					stringLength: {
						min: 2,
						max: 30,
						message: '请输入2到30个字符'
					},
					regexp: {
						regexp: /[1-9]\d*/,
						message: '工号只能由数字组成 '
					}
				}
			},
			password: {
				message: '密码无效',
				validators: {
					notEmpty: {
						message: '密码不能为空'
					},
					stringLength: {
						min: 6,
						max: 30,
						message: '用户名长度必须在6到30之间'
					},
					different: { //不能和员工账户相同
						field: 'account',
						message: '不能和员工账户相同'
					}
				}
			},
			pwd: {
				message: '密码无效',
				validators: {
					notEmpty: {
						message: '密码不能为空'
					},
					stringLength: {
						min: 6,
						max: 30,
						message: '用户名长度必须在6到30之间'
					},
					identical: { //相同
						field: 'password',
						message: '两次密码不一致'
					},
					different: { //不能和员工账户相同
						field: 'account',
						message: '不能和员工账户相同'
					}
				}
			}, 
			shop_id: {
				validators: {
					notEmpty: {
						message: '请选择店铺'
					}
				}
			},
			post_code: {
				validators: {
					notEmpty: {
						message: '请选择职位'
					}
				}
			},
			mobile: {
				validators: {
					notEmpty: {
						message: '手机号不能为空'
					},
					regexp: {
						//regexp: "^([0-9]{11})?$",
						//regexp: /^1[3|5|8|9]{1}[0-9]{9}$/,
						//regexp:/^1[345789]\d{9}$/,
						regexp: "^(13[0-9]|14[579]|15[0-3,5-9]|16[6]|17[0135678]|18[0-9]|19[89])\\d{8}$",
						message: '手机号码格式错误'
					}
				}
			},
			idno: {
				validators: {
					notEmpty: {
						message: '身份证不能为空'
					},
					regexp: {
						regexp: /\d{17}[\d|x]|\d{15}/,
						message: '身份证格式错误'
					}
				}
			},
			phone: {
				validators: {
					notEmpty: {
						message: '电话不能为空'
					},
					regexp: {
						regexp: /[0-9-()]{7,18}/,
						message: '电话格式错误'
					}
				}
			}, 
		}
	});
	
	//点击保存按钮进行 表单验证 
	//验证成功 提交表单 刷新界面
	$("#zjjpreserve").click(
		function() {
			console.log("---");
			//进行表单验证
			var bv = form.data('bootstrapValidator');
			bv.validate();
			if(bv.isValid()) {
				document.forms[0].action="/bsc/shop/insertshop";
				document.forms[0].submit();
			}
		}		
	);
	
});
//表单验证结束<script type="text/javascript">
//开始表单验证
var form = $('#form');
$(document).ready(function() {
	form.bootstrapValidator({
		message: '输入值不合法',
		feedbackIcons: {
			valid: 'glyphicon glyphicon-ok',
			invalid: 'glyphicon glyphicon-remove',
			validating: 'glyphicon glyphicon-refresh'
		},
		fields: {
			show_status: {
				validators : {
					notEmpty : {//检测非空,radio也可用  
						message : '角色不能为空'
					},
					callback : {
						message : '必须选择一个状态',
						callback : function(value, validator) {

							if (value == -1) {
								return false;
							} else {
								return true;
							}
						}
					}
				}
			},
			shop_name: {
				message: '店铺名称不合法',
				validators: {
					notEmpty: {
						message: '店铺名称不能为空'
					},
					stringLength: {
						min: 2,
						max: 6,
						message: '请输入2到6个字符'
					}
					
				}
			},
			file: {
                validators: {
                    notEmpty: {
                        message: '上传图片不能为空'
                    },
                    file: {
                        extension: 'png,jpg,jpeg',
                        type: 'image/png,image/jpg,image/jpeg',
                        message: '请重新选择图片'
                    }
                }
            },
            shop_license: {
				message: '营业执照不合法',
				validators: {
					notEmpty: {
						message: '营业执照不能为空'
					},
					stringLength: {
						min: 13,
						max: 13,
						message: '请输入13位数'
					},
					regexp: {
						regexp: /^[0-9]*$/,
						message: '只能由数字组成'
					}
				}
			}, 
			shop_phone: {
				message: '手机号不合法',
				validators: {
					notEmpty: {
						message: '手机号不能为空'
					},
					stringLength: {
						min: 11,
						max: 11,
						message: '请输入11位数'
					},
					regexp: {
						regexp: /^[0-9]*$/,
						message: '只能由数字组成'
					}
				}
			}, 
			shop_address: {
				message: '地址不合法',
				validators: {
					notEmpty: {
						message: '地址不能为空'
					},
					stringLength: {
						min: 6,
						max: 8,
						message: '至少6到8位字符'
					},
					regexp: {
						regexp: /^[\u4e00-\u9fa5]{0,}$/,
						message: '只能由汉字组成'
					}
				}
			}, 
		}
	});
	
	//点击保存按钮进行 表单验证 
	//验证成功 提交表单 刷新界面
	$("#zjjpreserve").click(
		function() {
			console.log("---");
			//进行表单验证
			var bv = form.data('bootstrapValidator');
			bv.validate();
			if(bv.isValid()) {
				document.forms[0].action="/bsc/bis_shop_user/save";
				document.forms[0].submit();
			}
		}		
	);
	
});
//表单验证结束
</script>

</html>